<template>
    <div class="message">
        <Header></Header>
        <div class="message-tt mn">
            消息中心
        </div>
        <div class="message-main mn">
            <div class="nav">
                <div :class="activeIndex == 0 ? 'nav-item active' : 'nav-item ' " @click="GetActiveUrl(0)">
                    <div class="icon">
                        <el-icon>
                            <Menu/>
                        </el-icon>
                    </div>
                    <p>全部推送</p>
                </div>
                <div :class="activeIndex == 1 ? 'nav-item active' : 'nav-item' " @click="GetActiveUrl(1)">
                    <div class="icon">
                        <el-icon>
                            <List/>
                        </el-icon>
                    </div>
                    <p>招标通知</p>
                </div>
                <div :class="activeIndex==2 ? 'nav-item active' : 'nav-item' " @click="GetActiveUrl(2)">
                    <div class="icon">
                        <el-icon>
                            <BellFilled/>
                        </el-icon>
                    </div>
                    <p>系统通知</p>
                </div>
            </div>

            <div class="list">
                <div class="list-item" v-for="item in 10">
                    <div class="icon">
                        <el-icon>
                            <BellFilled/>
                        </el-icon>
                    </div>
                    <div class="txt">
                        <div class="tt">招标信息</div>
                        <div class="desc">
                            通知内容
                        </div>
                        <div class="time">2023-06-21  12:30 </div>
                    </div>
                </div>
                <div class="pages">
                    <el-pagination :total="1000" background layout="prev, pager, next"/>
                </div>
            </div>
        </div>
        <Footer></Footer>
    </div>
</template>


<script setup>
/**
 * 组件引入
 */
import {onMounted, reactive, ref} from 'vue'
import http from "../../api/api.js"
import msg from "../../utils/Message.js"
import Footer from "../../components/Footer.vue"
import Header from "../../components/Header.vue"

/**
 * 全局变量
 * @type {UnwrapNestedRefs<{count: string, list: *[]}>}
 */

const activeIndex = ref(0)

/**
 * 页面挂载后
 */
onMounted(() => {
    // initPageData();
});


/**
 * 方法区
 */

function GetActiveUrl(e){
    activeIndex.value = e
}

// 初始化数据
const initPageData = () => {
    http.HttpGet("GetDocumentClassIndex").then((res) => {
        initData.loading = false
        if (res.code == 0) {
            initData.list = res.data
            msg.message(res.msg)
        } else {
            msg.message(res.msg, 'error')
        }
    })
}

</script>

<style lang="scss" scoped>
@import '../../assets/scss/index.scss';
</style>

